/*我的信息*/
const my_info = new Vue({
    el : "#my-info",
    data : function () {
        return {
            username : "",
            role_name : "",
        }
    },
    methods : {
        update : function () {
            $.post("/getCurrentUserInfo", function (data) {
                const json = $.parseJSON(data)
                if (json.code === 0){
                    console.log(json)
                    my_info.$data.username = json.object.map.username
                    my_info.$data.role_name = json.object.map.role_name
                }
            })
        },
        logout : function () {
            layer.confirm('是否注销？', {
                btn: ['确定','取消'] //按钮
            }, function(index){
                layer.close(index)
                $.post("/logout", function () {
                    window.location.href = "/"
                })
            })

        }
    }
})

/*权限组件*/
const permission_info = new Vue({
    el : "#permission-info",
    data : function () {
        return {
            /*权限类别*/
            pTypes : [
            ],
            /*权限*/
            permissions : [
            ],
            selected_pType : null,
            selected_permission : null,
            input_permission : {
                name : "",
                desc : "",
                link : "",
            }
        }
    },
    methods : {
        /*刷新权限类型列表*/
        updatePTypes : function(){
            $.post("/manage/selectAllPType",function (data) {
                const json = $.parseJSON(data)
                permission_info.pTypes.splice(0, permission_info.pTypes.length)
                if (json.code === 0){
                    for (let i = 0; i < json.list.length; i++) {
                        permission_info.pTypes.push(json.list[i])
                    }
                }
                if (permission_info.selected_pType !== null){
                    let id = permission_info.selected_pType.id
                    for (let i = 0; i < permission_info.pTypes.length; i++) {
                        if ( permission_info.pTypes[i].id === id){
                            permission_info.permissions = permission_info.pTypes[i].permissions
                            break
                        }
                    }
                }
            })
        },
        /*刷新权限列表*/
        updatePermissions : function(ptid){
            // todo 刷新权限列表
        },
        /*解析Json操作*/
        processJson : function(data, type){
            const json = $.parseJSON(data)
            if (json.code === 0){
                layer.alert(json.msg, {
                    icon: 1,
                    skin: 'layer-ext-moon'
                })
                permission_info.updatePTypes()
                this.selected = null
            } else {
                layer.alert(json.msg, {
                    icon: 2,
                    skin: 'layer-ext-moon'
                })
            }
        },
        /*添加权限类型*/
        addPType : function () {
            // TODO 权限类型
            layer.prompt({title: '请输入欲添加的权限类型名', formType: 0}, function(name, index){
                layer.close(index);
                $.post("/manage/addPType", {
                    ptName : name,
                    desc : ""
                }, function (data) {
                    permission_info.processJson(data, 1)
                })
            });
        },
        addPermission : function(id){
            layer.prompt({title: '请输入欲添加的权限名', formType: 0}, function(pName, index){
                layer.close(index);
                $.post("/manage/addPermission", {
                    pName : pName,
                    desc : "",
                    link : "",
                    ptid : id,
                }, function (data) {
                    permission_info.processJson(data, 1)
                })
            });
        },
        /*点击权限类型弹出右键菜单*/
        popupMenu : function(pType){
            popmenu({
                items : {
                    modify : {name : "修改", },
                    del : {name : "删除", }
                },
                callback : function (item) {
                    let $item = $(item).attr("id");
                    if ($item === "modify"){
                        // 修改权限类型名
                        layer.prompt({title: '请输入修改后的权限名', formType: 0}, function(pName, index){
                            layer.close(index);
                            $.post("/manage/modifyPType", {
                                id : pType.id,
                                ptName : pName,
                                desc : ""
                            }, function (data) {
                                permission_info.processJson(data, 1)
                            })
                        });

                    } else if ($item === "del"){
                        // 删除权限类型
                        layer.confirm('是否确认删除该权限类型？该操作不可逆！', {
                            btn: ['确定','取消'] //按钮
                        }, function(index){
                            layer.close(index)
                            layer.confirm('删除之后，该类型下的所有权限也会一起被删除，请确认！', {
                                btn: ['确定','取消'] //按钮
                            }, function(index){
                                layer.close(index)
                                $.post("/manage/delPType", {
                                    id : pType.id
                                }, function (data) {
                                    permission_info.processJson(data, 1)
                                })
                            })

                        });
                    }
                }
            })
        },
        selectPType : function (pType) {
            this.selected_pType = pType
            this.permissions = pType.permissions
        },
        selectPermission : function (permission) {
            if (this.selected_permission === permission){
                this.selected_permission = null
                this.input_permission = {
                    name: "",
                    desc: "",
                    link: ""
                }
            } else {
                this.selected_permission = permission
                this.input_permission = permission
            }

        },
        /*修改权限*/
        modifyPermission : function () {
            if (this.selected_permission !== null && this.selected_pType !== null){

                $.post("/manage/modifyPermission", {
                    pid : this.selected_permission.id,
                    pName : this.input_permission.name,
                    desc : this.input_permission.desc,
                    link : this.input_permission.link,
                    ptid : this.selected_pType.id,
                }, function (data) {
                    permission_info.processJson(data, 1)
                })
            }
        },
        /*删除权限*/
        delPermission : function () {
            if (permission_info.selected_permission !== null ){
                layer.confirm('是否确认删除该权限？该操作不可逆！', {
                    btn: ['确定','取消'] //按钮
                }, function(index){
                    layer.close(index)
                    $.post("/manage/delPermission", {
                        id : permission_info.selected_permission.id
                    }, function (data) {
                        permission_info.processJson(data, 1)
                    })
                });

            }
        }
    }
})
/*角色组件*/
const role_info = new Vue({
    el: "#role-info",
    data : function () {
        return {
            roles : [
            ],
            /*权限类别和权限表*/
            permissionList : [
                
            ],
            /*当前选中角色*/
            selected : null
        }
    },
    methods : {
        /*刷新所有角色*/
        update : function(){
            // TODO 刷新所有角色
            // 刷新所有角色
            $.post("/manage/selectAllRole", function (data) {
                const json = $.parseJSON(data)
                role_info.$data.roles.splice(0, role_info.$data.roles.length)
                if (json.code === 0){
                    for (let i = 0; i < json.list.length; i++) {
                        role_info.$data.roles.push(json.list[i])
                    }
                }
                // 刷新所有权限
                $.post("/manage/selectAllPType", function (data) {
                    const json = $.parseJSON(data)
                    if (json.code === 0){
                        role_info.$data.permissionList.splice(0, role_info.$data.permissionList.length)
                        if (json.code === 0){
                            for (let i = 0; i < json.list.length; i++) {
                                role_info.$data.permissionList.push(json.list[i])
                            }
                        }
                    }
                    role_info.updateCurrentlySelected()
                })
            })
        },
        updateCurrentlySelected : function(){
            if (role_info.selected !== null){
                for (let i = 0; i < this.roles.length; i++) {
                    if (this.roles[i].id === role_info.selected.id){
                        role_info.select(this.roles[i])
                    }
                }
            }
        },
        processJson : function(data, type){
            const json = $.parseJSON(data)
            if (json.code === 0){
                layer.alert(json.msg, {
                    icon: 1,
                    skin: 'layer-ext-moon'
                })
                role_info.update()
            } else {
                layer.alert(json.msg, {
                    icon: 2,
                    skin: 'layer-ext-moon'
                })
            }
        },
        /*添加角色*/
        addRole : function () {
            layer.prompt({title: '请输入欲添加的角色名', formType: 0}, function(name, index){
                layer.close(index);
                $.post("/manage/addRole", {
                    rName : name,
                    desc : ""
                }, function (data) {
                    role_info.processJson(data, 1)
                })
            });
        },
        del : function(rid){
            layer.confirm('是否确认删除该角色？该操作不可逆！', {
                btn: ['确定','取消'] //按钮
            }, function(index){
                layer.close(index)
                $.post("/manage/delRole", {
                    id : rid
                }, function (data) {
                    role_info.processJson(data, 3)
                })
            });


        },
        /*点击授权*/
        authorize : function (id){
            let data = {}
            data.permissions = []
            data.rName = this.selected.name
            data.desc = ""
            data.id = id
            for (let i = 0; i < this.permissionList.length; i++) {
                let permissions = this.permissionList[i].permissions;
                for (let j = 0; j < permissions.length; j++) {
                    if (permissions[j].selected === true){
                        data.permissions.push(permissions[j].id)
                    }
                }
            }
            $.ajax({
                type: "POST",
                url: "/manage/modifyRole",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(data),
                dataType: "text",
                success: function (message) {
                    role_info.processJson(message, 2)
                }
            });
            // todo 授权角色
        },
        /*更新选中框*/
        updateSelected : function(role){
            for (let i = 0; i < this.permissionList.length; i++) {
                let permissions = this.permissionList[i].permissions;
                //console.log(permissions)
                for (let j = 0; j < permissions.length; j++) {
                    permissions[j].selected = false;
                    if (role !== undefined && role !== null){
                        for (let k = 0; k < role.length; k++) {
                            if (role[k].id === permissions[j].id){
                                permissions[j].selected = true;
                                break
                            }
                        }
                    }

                }
            }
        },
        /*选中*/
        select : function (role) {
            if (this.selected !== role){
                this.selected = role
                this.updateSelected(role.permissions)
            } else {
                this.updateSelected()
                this.selected = null

            }
        }
    }
})
/*用户信息组件*/
const user_info = new Vue({
    el: "#user-info",
    data : function () {
        return {
            uid : null,
            username : "",
            password : "",
            role : "",
            roles : role_info.$data.roles
        }
    },
    methods: {
        verification : function(username, password, role_id, type){
            if (username === ""){
                layer.alert("请输入用户名！")
                return false
            }
            if (type === undefined || type !== 2){
                if (password === ""){
                    layer.alert("请输入密码！")
                    return false
                }
            }
            if (role_id === ""){
                layer.alert("请选择权限角色！")
                return false
            }
            return true
        },
        processJson : function(data, type){
            const json = $.parseJSON(data)
            if (json.code === 0){
                layer.alert(json.msg, {
                    icon: 1,
                    skin: 'layer-ext-moon'
                })
                user_list.update()
                if (type === 3 || type === 1){
                    this.uid = null
                    this.username = ""
                    this.password = ""
                    this.role = ""
                }

            } else {
                layer.alert(json.msg, {
                    icon: 2,
                    skin: 'layer-ext-moon'
                })
            }

        },
        /*添加用户*/
        addUser : function(username, password, role_id){
            if (this.verification(username, password, role_id)){
                $.post("/manage/addUser", {
                    username : username,
                    password : password,
                    rid : parseInt(role_id)
                }, function (data) {
                    user_info.processJson(data, 1)
                })
            }
        },
        /*修改用户*/
        modify : function (userid, username, password, role_id) {
            if (this.verification(username, password, role_id, 2)){
                $.post("/manage/modifyUser", {
                    id : userid,
                    username : username,
                    password : password,
                    rid : parseInt(role_id)
                }, function (data) {
                    user_info.processJson(data, 2)
                })

            }
        },
        /*删除用户*/
        del : function (userid) {
            layer.confirm('是否确认删除该账号？该操作不可逆！', {
                btn: ['确定','取消'] //按钮
            }, function(index){
                layer.close(index)
                $.post("/manage/delUser", {
                    id : userid
                }, function (data) {
                    user_info.processJson(data, 3)
                })
            });


        }
    }
})
/*用户列表组件*/
const user_list = new Vue({
    el: "#user-list",
    data: function () {
        return {
            users : [

            ],
            /*目前选中*/
            selected : 0
        }
    },
    methods: {
        /*刷新所有用户*/
        update : function(){
            $.post("/manage/selectAllUser", {}, function (data) {
                const json = $.parseJSON(data)
                user_list.users.splice(0, user_list.users.length)
                if (json.code === 0){
                    for (let i = 0; i < json.list.length; i++) {
                        user_list.users.push(json.list[i])
                    }
                }
            })
        },
        /*选中*/
        select : function (id, username, role) {
            if (user_info.$data.uid === id){
                user_info.$data.uid = null
                this.selected = 0
            } else {
                user_info.$data.uid = id
                user_info.$data.username = username
                user_info.$data.password = ""
                user_info.$data.role = role
                this.selected = id
            }

        }
    }
})


jQuery.Huitab =function(tabBar,tabCon,class_name,tabEvent,i){
    const $tab_menu = $(tabBar);
    // 初始化操作
    $tab_menu.removeClass(class_name);
    $(tabBar).eq(i).addClass(class_name);
    $(tabCon).hide();
    $(tabCon).eq(i).show();

    $tab_menu.bind(tabEvent,function(){
        $tab_menu.removeClass(class_name);
        $(this).addClass(class_name);
        const index = $tab_menu.index(this);
        $(tabCon).hide();
        $(tabCon).eq(index).show()})
}
$(function(){
    /*初始化分页*/
    $.Huitab("#tab-management .tabBar span","#tab-management .tabCon","current","click","3")

    // 初始化所有用户
    user_list.update()
    // 初始化所有角色
    role_info.update()
    // 更新权限相关
    permission_info.updatePTypes()
    // 刷新个人信息
    my_info.update()
})